<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/Public/jquery.min.js"></script>
</head>
<body>
<button onclick="selectAl()">全选</button>
<button onclick="unSelect()">反选</button>
<button onclick="delUser()">删除</button>


<button id="addUser">添加</button>
<table border="1" id="userTbl">
    <thead>
    <tr>
        <th><input type="checkbox" onclick="selectAll(this)"></th>
        <th>编号</th>
        <th>用户名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <?php if(is_array($user)): $i = 0; $__LIST__ = $user;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$v): $mod = ($i % 2 );++$i;?><tr id="row_<?php echo ($v["uid"]); ?>">
            <td><input value="<<?php echo ($v["uid"]); ?>>" class="rowcb" type="checkbox"></td>
            <td><?php echo ($v["uid"]); ?></td>
            <td><?php echo ($v["uname"]); ?></td>
            <td><?php echo ($v["age"]); ?></td>
            <td><?php echo ($v["sex"]); ?></td>
            <td>
                <button onclick="delUser(<?php echo ($v["uid"]); ?>)">删除</button>
                <button onclick="editUser(<?php echo ($v["uid"]); ?>)">修改</button>
            </td>
        </tr><?php endforeach; endif; else: echo "" ;endif; ?>
    </tbody>
</table>

<div id="page">
    <?php $__FOR_START_6425__=1;$__FOR_END_6425__=$pages;for($i=$__FOR_START_6425__;$i < $__FOR_END_6425__;$i+=1){ ?><span data-val="<?php echo ($i); ?>"><?php echo ($i); ?></span>|<?php } ?>
</div>
<form style="display:none" id="addUserForm">
    <fieldset>
        <legend>添加用户</legend>
        用户<input type="text" name="uname"><br>
        性别<input type="text" name="sex"><br>
        年龄<input type="text" name="age"><br>
        <button type="button" id="saveUser">保存</button>
        <button type="button" id="closeUser">关闭</button>
    </fieldset>
</form>

<form id="editUserForm" style="display: none;">
    <fieldset>
        <legend>编辑用户</legend>
        <input type="hidden" name="uid"><br>
        用户<input type="text" name="uname"><br>
        性别<input type="text" name="sex"><br>
        年龄<input type="text" name="age"><br>
        <button type="button" onclick="saveEditUser()">保存</button>
        <button type="button" onclick="colseEditForm()">关闭</button>
    </fieldset>
</form>

<script>
    //删除
    function delUser(uid){
        if(confirm('确认删除吗？')){
            $('#row_'+uid).remove();
            $.get("<?php echo U('delUsers');?>",{uid:uid},function(data) {
                 if (data.error === 0) {
                   alert(data.msg);
                }
            })
        }

    }
    //添加
    $('#addUser').click(function(){
        $('#addUserForm').show();
    });
    $('#closeUser').click(function(){
        $('#addUserForm').hide();
    });
    $('#saveUser').click(function(){
        var data;
        data= {
            uid:$('#editUserForm [name=uid]').val(),
            uname:$('#editUserForm [name=uname]').val(),
            sex:$('#editUserForm [name=sex]').val(),
            age:$('#editUserForm [name=age]').val(),
        };
        //console.log(data);
        $.post('<?php echo U("doAddUser");?>',data,function(res){
            if(res.error===0){
                data =res.data;
                newRow='<tr id="row_'+data.uid+'"><td><input value="<<?php echo ($v["uid"]); ?>>" class="rowcb" type="checkbox"></td><td> '+data.uid+'</td><td> '+data.uname+'</td><td>'+data.age+'</td><td>'+data.sex+'</td>' +
                        '<td><button onclick="delUser('+data.uid+')">删除</button><button onclick="ediitUser('+data.uid+')">修改</button></td></tr>';

                $('#userTbl').append(newRow);
            }else{
                alert(res.msg);//why
            }
        });
       //修改
        function colseEditForm() {
            $('#editUserForm').hide();
        }
        function saveEditUser() {
            var data,newRow;
            data = {
                uid:$('#editUserForm [name=uid]').val(),
                uname:$('#editUserForm [name=uname]').val(),
                sex:$('#editUserForm [name=sex]').val(),
                age:$('#editUserForm [name=age]').val(),
            };
            $.post('<?php echo U("doEditUser");?>',data,function (res) {
                console.log(res);
                if(res.error===0){
                    var uid=res.data.uid;
                    $('#row_'+uid+' td:eq(1)').text(res.data.uname);
                    $('#row_'+uid+' td:eq(2)').text(res.data.age);
                    $('#row_'+uid+' td:eq(3)').text(res.data.sex);
                    alert(res.msg);
                }
            });
        }
        function editUser(uid) {
            $.get('<?php echo U("getUser");?>',{uid:uid},function(data){
                $('#editUserForm').show();
                $('#editUserForm [name=uid]').val(uid);
                $('#editUserForm [name=uname]').val(data.uname);
                $('#editUserForm [name=age]').val(data.age);
                $('#editUserForm [name=sex]').val(data.sex);
            });
        }
    })
    $(function(){
        //分页
        $('#page span').click(function(){
            var pagenum=$(this).attr('data-val');
            $.get('<?php echo U("getShow");?>',{p:pagenum},function(data) {
                var html='';
                for(var i in data){
                    html += '<tr><td>'+data[i].uid+'</td><td>'+data[i].uname+'</td><td>'+data[i].age+'</td><td>'+data[i].sex+'</td>' +
                            '<td><button onclick="delUser('+data.uid+')">删除</button><button onclick="ediitUser('+data.uid+')">修改</button></td></tr>';
                }
                $a= $('#userTbl tbody').html(html);
                console.log($a);exit;
            });
        } );
    })
    function selectAll(obj) {
        var checkstatu = $(obj).prop('checked');
        $('.rowcb').prop('checked',checkstatu);
    }
    function selectAl() {
        $('.rowcb').prop('checked',true);
    }
    function unSelect() {
        $('.rowcb').prop('checked',function (index,val) {
            return !val;
        });
    }
    function delUser() {
        var uid  = $('.rowcb:checked').map(function () {
            console.log(this);
            $(this).parent().parent().remove();//删除当前行
            return $(this).val();
        });
        uid = uid.get().join();
        $.get('<<?php echo U("delUsr");?>>',{uid:uid},function (data) {
            alert(data.msg);
        });
    }


</script>
</body>
</html>